<script>
  import {Post} from '../lib/net.js';
  import User from '../model/user.js';
  import InputModal from '../components/inputModal.svelte';
  import {AgentAdd} from '../api.js';
  import md5 from 'md5';
  import {onMount} from 'svelte';
  import Btn from '../components/btn.svelte';
  // import QrcodeMin from 'qrcode'

  let code = ''
  let url = ''
  new ClipboardJS('.copyBtn');

  onMount(() => {
    code = GetUrlParam("code")
    url = 'https://www.cftcex.com/register?code=' + code
	//url = 'https://www.colaex.pro/register?code=' + code
    // qrcode88();
  })

 function qrcode88() {
   new QrcodeMin(document.getElementById("qrcode"),
     url // 设置要生成二维码的链接
   );
 }

  function GetUrlParam(paraName) {
    var url = document.location.toString();
    var arrObj = url.split("?");

    if (arrObj.length > 1) {
      var arrPara = arrObj[1].split("&");
      var arr;

      for (var i = 0; i < arrPara.length; i++) {
        arr = arrPara[i].split("=");

        if (arr != null && arr[0] == paraName) {
          return arr[1];
        }
      }
      return "";
    } else {
      return "";
    }
  }

</script>

<div class="container">
		<div style="display: flex;flex-direction: row;align-items: center;width: 99%;margin: 5px;height: 60px;background-color: white;margin-top: 5px"
				 class="borderRadius4">
        <span style="color: #20222A;margin: 20px">
           生成二维码和邀请码
        </span>
		</div>
		<div class="cts">
				<div class="width100 padding20 rowCen">代理开通成功</div>
				<div class="width100 padding20 flexRowCenter">
						<span>邀请码:<span id="foo">{code}</span></span>
						<span class="copyBtn" data-clipboard-target="#foo">复制</span>
				</div>
				<div class="width100 padding20 flexRowCenter">
						<span>邀请链接: <span id="hood">{url}</span></span>
						<span class="copyBtn" data-clipboard-target="#hood">复制</span>
				</div>
				<div class="width100">
						<div id="qrcode" style="width: 100px;height: 100px;margin-bottom: 20px"></div>
						<!--<img style="width: 100px;" src="images/all.png" alt="">-->
				</div>
				<div class="width100 padding20 copyBtn2 flexRowCenter">
						保存到电脑
				</div>
		</div>
</div>

<style>
		.container {
				width: 99%;
				margin: 5px;
		}

		.cts {
				width: 99%;
				height: 100vh;
				margin: 5px;
				padding: 100px 20%;
				display: flex;
				flex-direction: column;
				/*align-items: flex-start;*/
				/*justify-content: flex-start;*/
		}

		.width100 {
				width: 100%;
		}

		.padding20 {
				padding: 10px 0;
		}

		.rowCen {
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
		}

		.copyBtn {
				width: 50px;
				display: flex;
				justify-content: center;
				align-items: center;
				color: rgba(49, 138, 253, 1);
				background: rgba(255, 255, 255, 1);
				border: 1px solid rgba(49, 138, 253, 1);
				border-radius: 4px;
				margin-left: 10px;
		}

		.copyBtn2 {
				width: 120px;
				display: flex;
				justify-content: center;
				align-items: center;
				color: rgba(49, 138, 253, 1);
				background: rgba(255, 255, 255, 1);
				border: 1px solid rgba(49, 138, 253, 1);
				border-radius: 4px;
				margin-left: 10px;
		}

		.flexRowCenter {
				display: flex;
				flex-direction: row;
				align-items: center;

		}
</style>
